<template>
	<view class="container">
		<view class="top">
			<u--form :model="form" ref="uForm" :rules="rules">
				<view class="dqglyBox">
					<!-- <u-form-item label="责任人:" labelWidth="160rpx" prop="zrrName" >
						<uni-combox v-model="form.zrrName"
						:candidates="sblist" style="width: 100%;"
						placeholder="请选择责任人员" emptyTips="无数据"
						></uni-combox>
					</u-form-item> -->
					<view class="two-one">
						<view class="two-oneLeft">责任人 :</view>
						<view style="margin-top: 8px;margin-right: 0px;">
							{{(user.selectDeptName||'')+'-'+(user.name||'')}}
						</view>
						<view style="margin-top: -0px;margin-right: 0px;">
							<u-button @click="complexChoose">选择</u-button>
						</view>
					</view>
					<u-form-item label="整改要求:" labelWidth="160rpx" prop="glyNow" >
						<u-input placeholder="请输入" v-model="form.glyNow" />
					</u-form-item>

					<view class="two-one">
						<view class="two-oneLeft">整改期限 :</view>
						<view style="margin-top: 5px;margin-right: 0px;">
							<uni-dateformat :date="value1" :threshold="[0,0]" format="yyyy-MM-dd"></uni-dateformat>

						</view>
						<view style="margin-top: -8px;margin-right: 0px;">
							<u-button @click="click">编辑</u-button>
						</view>
					</view>
				<view class="two-one">
					<u-form-item label="短期/长期:" labelWidth="160rpx" prop="wxms" >	
						<u-switch v-model="form.yanqi" activeColor="red"></u-switch>
					</u-form-item>
				</view>
					<u-datetime-picker
								:show="show1"
								v-model="value1"
								mode="date"
								closeOnClickOverlay
								@confirm="confirm"
								@cancel="cancel"
								@change="change"
								@close="close"
							></u-datetime-picker>
				</view>
			</u--form>
			<view class="btn">
				<u-button class="btn" type="primary" @click="submit(form)">我来派单</u-button>
			</view>
		</view>
	</view>
</template>

<script>
	import * as dd from 'dingtalk-jsapi'
	export default {
		data() {
			return {
				form: {
						glyNow: '',
						zrrName: '',
						xzryName: [],
						yanqi:false,
					},
				rules: {
							glyNow: [
						{
							required: true,
							message: '请输入',
							trigger: ['blur', 'change']
									}
							],zrrName: [
						{
							required: true,
							message: '请选择',
							trigger: ['blur', 'change']
									}
							],
							xzryName: [
							{
								required: true,
								message: '请选择',
								trigger: ['blur', 'change']
										}
								],
				},
				options: ['Option 1', 'Option 2', 'Option 3'], // 下拉选项的数组
				myzpSz: {},
				sblist: [],// 默认选中的值
				sblist2: [],// 默认选中的值
				sb:'',
				userInfo: {},
				show:false,
				dataLists:[],
				popupTitle:"用户选择",// 初始选项
                options: [],
				foods:[
					{
						id:'1',
						name:'红烧鱼'
					},
					{
						id:'2',
						name:'炒三丝'
					},
					{
						id:'3',
						name:'青椒肉丝'
					}
				],
				foodId:[],
				foodName:[],
				selected:[],
				show1: false,
				value1: Number(new Date()),
				current: 1,
				user:{},
				ddconfig:{
					nonceStr:'SAGEX3',
					timeStamp:0,
				},
			}
		},
		onLoad(query) {
			console.log(query,'我来指派');
			// 从 query 中获取传递过来的数据，并将其转换为对象
			this.myzpSz = JSON.parse(query.myzpData || "{}");
			this.userInfo = uni.getStorageSync('userInfo')
			this.xz()
			this.initdd()
		},
        computed:{
            resultFood(){
                return this.foodName.join(",");
            },
        },
		methods: {
			initdd(){
				// alert(location.href)
				this.ddconfig.timeStamp=new Date().getTime()
				uni.request({
				  url: 'http://125.64.76.148:8125/KXJDDDApi/ddconfig?code=1'
				  +'&nonceStr='+this.ddconfig.nonceStr
				  +'&timeStamp='+this.ddconfig.timeStamp
				  +'&url=http://125.64.76.148:8125/anquan/', // 替换为实际的接口URL
				  method: 'GET',
				  data: {},
				  success: (res) => {
					  console.log(res)
					  // uni.$u.toast('initdd.success:'+JSON.stringify(res))
					  // alert('success:'+JSON.stringify(res))
					  dd.config({
					      agentId: '2833818530', // 必填，微应用ID
					      corpId: 'ding81f5b58b1546a0fd35c2f4657eb6378f',//必填，企业ID
					      timeStamp: this.ddconfig.timeStamp, // 必填，生成签名的时间戳
					      nonceStr: this.ddconfig.nonceStr, // 必填，自定义固定字符串。
					      signature: res.data.sign, // 必填，签名
					      type:0/1,   //选填。0表示微应用的jsapi,1表示服务窗的jsapi；不填默认为0。该参数从dingtalk.js的0.8.3版本开始支持
					      jsApiList : [
					          'complexChoose',
					      ] // 必填，需要使用的jsapi列表，注意：不要带dd。
					  });

					  dd.error(function (err) {
					      uni.$u.toast('钉钉初始化错误: ' + JSON.stringify(err));
					  })//该方法必须带上，用来捕获鉴权出现的异常信息，否则不方便排查出现的问题
				  },
				  fail(err) {
					  alert('fail:'+err)
				  	console.log(err)
				  }
				})
			},
			complexChoose(){
				dd.complexChoose({
					maxUsers: 1,
					responseUserOnly: false,
					corpId: 'ding81f5b58b1546a0fd35c2f4657eb6378f',
					disabledDepartments: [],
					disabledUsers: [],
					deptId: '-1',
					multiple: false,
					limitTips: '选择人数不能超过1个',
					title: '选择人员',
					pickedDepartments: [],
					requiredDepartments: [],
					filterOrgEcological: false,
					requiredUsers: [],
					showLabelPick: true,
					appId: '2833818530',
					pickedUsers: [],
					showOrgEcological: false,
					rootPage: `rootPage示例值`,
					startWithDepartmentId: '0',
					success: (res) => {
						const { users, departments, selectedCount } = res;
						this.user=users[0]
					},
					fail: () => {},
					complete: () => {},
				});
			},
			close() {
				this[`show${this.current}`] = false
			},
			cancel() {
				this[`show${this.current}`] = false
			},
			confirm(e) {
				this[`show${this.current}`] = false
				// this.result(e.value, e.mode)
			},
			change(e) {
				// console.log('change', e)
			},
			click(){
				if(this.value1==''){
					this.value1=Number(new Date())
				}
				this.show1 = true
			},
			openFood(){
                this.$refs.showFood.showPopup()
            },
            confirmFood(value,data) {
				// console.log(value)
				// console.log(data)
				this.foodId = value
				// console.log(this.foodId,'this.foodId');
				this.foodName = data.map(it=>it.name)
				// console.log(this.foodName,'this.foodName');
				this.selected = data
				// console.log(this.selected,'this.selected');
				this.$refs.showFood.closePopup()
				console.log(this.selected)
            },
			whenChanged(e) {
                console.log(JSON.stringify(e))
                this.sblist2 = e
            },
			change(e) {
			      console.log("e:", e);
				  this.show=true
				  console.log(this.dataLists)
				  console.log(this.sblist2)
			},
			qsearch(e){
				console.log('qsearch',e)
				this.dataLists=this.sblist2.filter(item=>item.text.indexOf(e) !== -1)
			},
			qsubmit(e){
				console.log('qsubmit',e)
				this.show=false
			},
			async xz(){
				let GRP1 = {
						GRP1: [{
							ID:this.userInfo.ID,//"1",
							Y1: 1,
					}]
				}
				let res = await this.$api.x3.x3request("WSLISTYDUR",GRP1)

							let cxsbData = JSON.parse(res.message)
							this.foods=[]
							this.selected=[]
							for (var i = 0; i < cxsbData.GRP1.length; i++) {
								if(cxsbData.GRP1[i].Y2==2){
									this.sblist.push(''+cxsbData.GRP1[i].NAME+'-'+cxsbData.GRP1[i].PHONE)
									this.sblist2.push({
										value:cxsbData.GRP1[i].PHONE,
										text:''+cxsbData.GRP1[i].NAME+'-'+cxsbData.GRP1[i].PHONE,
										is_selected:false,
									})
									this.foods.push({
										id:cxsbData.GRP1[i].ID,
										name:cxsbData.GRP1[i].NAME,
									})
								}
							}
							this.dataLists=this.sblist2
			},
			async submit(q) {
				var sb = this.form.zrrName
				var sb2 = this.form.xzryName
				// if(!this.sblist.find(item => item==sb)){
				if(this.user.name=='' || this.user.name==undefined){
					uni.$u.toast('责任人未选择')
					return
				}
				if(this.value1==''){
					uni.$u.toast("整改时间未填写");
					return
				}
				var name=this.user.name//sb.slice(0,sb.indexOf('-'))
				var phone=this.user.emplId//sb.slice(sb.indexOf('-')+1)
				console.log(name,phone)
				// return
				let GRP1 = {
					GRP1: [{
						YFLG: "1",//标识
						YDRNUM: this.myzpSz.YDRNUM,//单号
						SERPSON: name,//维修人
						SERPHONE: phone,//维修人电话
						YFLY: q.glyNow,//附带语言
						YPDUSR: this.userInfo.NAME,
						YPDPHONE: this.userInfo.PHONE,
						SERTIME: this.parseTime(this.value1),//预计时间
						YCQ: this.form.yanqi==false ? "1" : "2",//短期/长期
					}],
					GRP4: [],
				}
				for (var i = 0; i < this.foodId.length; i++) {
					GRP1.GRP4.push({
						YUSERID:this.foodId[i]
				  	})
				}
				let res = await this.$api.x3.x3request("WSGENXDR2",GRP1)

					// 请求成功的处理逻辑
					if(res.status=="error"){
						alert(res.data.message);
						return false;
					}else{
						let resR = JSON.parse(res.message)
						// console.log(resR.GRP2,56777);
						if(resR.GRP1.WOK==0){
							// 显示创建成功的消息提示
							 uni.showToast({
							   title: '派单成功',
							   icon: 'success',
							   duration: 2000
							});
							this.form=''
							let that = this
							setTimeout(function() {
								uni.redirectTo({url:"/pages/dzzxPages/dzzxPages"})
							}, 2000);
						}else{
							uni.showToast({
							   title: '派单失败',
							   icon: 'error',
							   duration: 2000
							});
						}
					}
			},
		}
	}
</script>

<style>

.formBox{
	width: 90%;
	margin: 0 auto;
	position: relative;
	top:60rpx;
}
.labelBox{
	background-color: white;
	padding-left: 15rpx;
	position: relative;
	top: 40rpx;
	display: flex;
	justify-content: space-between;
}
.labelBox2{
	background-color: white;
	padding-left: 15rpx;
	position: relative;
	top: 70rpx;
	display: flex;
	justify-content: space-between;
}
.labelBox3{
	background-color: white;
	padding-left: 15rpx;
	position: relative;
	top: 100rpx;
	display: flex;
	justify-content: space-between;
}
.labelBox4{
	background-color: white;
	padding-left: 15rpx;
	position: relative;
	top: 130rpx;
	display: flex;
	justify-content: space-between;
}
	.two-one{
		/* height: 60rpx; */
		display: flex;
		justify-content: space-between;
	}
.two-oneLeft{
	width: 150rpx;
	line-height: 68rpx;
	/* color: gray; */
	text-align: left;
}
.container {
 height: 100vh;
  background-color: #f2f2f2 !important;
  overflow: hidden;
}
.top{
	margin-top: 20rpx;

}
.labelBox{
	display: flex;
	justify-content: space-between;
	padding-left: 20rpx;
	border-bottom: 1px solid #f1f1f1;
}
.fdyyBox{
	margin-top: 60rpx;
	background-color: white;
	padding-left: 20rpx;
}
.btn{
	width: 60%;
	margin: 30rpx auto;
	}
.dqglyBox{
	padding-left: 20rpx;
	margin-top: 70rpx;
	background-color: white;
}
/* 样式可以根据您的需求进行自定义 */
.picker {
  padding: 15rpx;
  border: 1px solid #ccc;
  border-radius: 5rpx;
  text-align: center;
}
.content{
    background-color: #f7f7f7;
    width: 100vw;
    height: 100vh;

}
.uni-title{
    font-size: 33rpx;
    font-weight: bold;
    padding: 20rpx 20rpx;
}
.uni-list-cell{
    background-color: #fff;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20rpx 20rpx;
    .uni-list-cell-left{
        font-size: 35rpx;
    }
}
.uni-list-cell-db{
    flex:1
}
.as-input{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    .customer-icon{
        padding: 0 0 0 5rpx;
    }
    .placeholder{
        font-size:33rpx;
        color:#999;
    }
    .as-content{
        color: #333;
        font-size: 33rpx;
    }
}
</style>
